<template>
    <view class="bg-content">

        <div style="padding-top: 50px;" v-if="!tbCommunityDynamicTypeList.length">
            <u-empty text="无动态信息" mode="news"></u-empty>
        </div>

        <div style="background-color: white;" v-for="(tbCommunityDynamicType, index) of tbCommunityDynamicTypeList" :key="tbCommunityDynamicType.id">
            <u-card :full="true" :border="false" padding="15" :foot-border-top="false">
                <view class="" slot="head">
                    <div style="display: flex;" @click="navigateTo(`/pages/sub/sub1-tabs/tabs/community-dynamic/community-dynamic-list/index`, null, tbCommunityDynamicType)">
                        <div style="width: 26px; height: 26px;">
                            <myImg :obj="tbCommunityDynamicType" :sysFile="{fkId: tbCommunityDynamicType.id}" class="picture"
                                   :customStyle="'pointer-events: none; height: 26px;  width: 26px; background-size: cover; background-repeat: no-repeat; background-position: center;'"
                                   :defaultUrl="'/pages/sub/sub1-tabs/static/icon/notice.png'"></myImg>
                        </div>
                        <div style="margin-left: 10px; font-size: 16px; width: 100%;">
                            {{tbCommunityDynamicType.name}}
                        </div>
                        <div style="width: 50px; color: #909399;">
                            更多...
                        </div>
                    </div>
                </view>
                <view class="" slot="body">
                    <div v-if="!tbCommunityDynamicType.tbCommunityDynamicList.length">暂无动态.</div>
                    <div v-if="tbCommunityDynamicType.tbCommunityDynamicList.length">
                        <div style="display: flex; padding: 15px 5px;" v-for="(tbCommunityDynamic, index2) in tbCommunityDynamicType.tbCommunityDynamicList"
                             :key="tbCommunityDynamic.id"
                             @click="navigateTo(`/pages/sub/sub1-tabs/tabs/community-dynamic/community-dynamic-list/community-dynamic-detail/index`, null, tbCommunityDynamic)">

                            <div style="width: 100%; font-size: 14px; padding-right: 10px;">
                                {{tbCommunityDynamic.title}}
                                <image src="/pages/sub/sub1-tabs/static/icon/new.png" style="padding-left: 5px; width: 16px; height: 16px; top: 3px;"
                                       v-if="!tbCommunityDynamic.isRead"></image>
                            </div>
                            <div style="width: 110px; color: #909399; text-align: right;">{{tbCommunityDynamic.showTime}}</div>
                        </div>
                    </div>
                </view>
                <view class="" slot="foot">
                </view>
            </u-card>
        </div>
    </view>
</template>

<script>

    import {TbCommunityDynamicTypeService} from "@/dev/services/tb-community-dynamic-type.service";
    import myImg from '@/components/my-img'

    export default {
        data() {
            return {
                isMounted: false,
                tbCommunityDynamicTypeList: [],
            }
        },
        components: {
            myImg
        },
        mounted() {
            const _self = this;
            this.isMounted = true;
            _self.findTbCommunityDynamicTypeList();
        },
        methods: {
            _onShow() {
                const _self = this;
                if (this.isMounted) {
                    _self.findTbCommunityDynamicTypeList();
                }
            },
            findTbCommunityDynamicTypeList() {
                const _self = this;
                new TbCommunityDynamicTypeService().findTbCommunityDynamicTypeListContainLatestDynamic({
                    communityId: _self.globalVariable.userInfo.tbCommunity.id,
                    status: "1",
                    deleted: 0,
                    orderBy: 'display_order asc'
                }).then(result => {
                    _self.tbCommunityDynamicTypeList = result;
                });
            }
        }
    }
</script>

<style lang="scss" scoped>
</style>
